Filipe Dourado's profile

MechWar - 2.5D Cinematic

MECHWAR - 2.5D Cinematic Streaming Template

Visão geral

O cenário de streamers de jogos está em constante crescimento, com novos criadores surgindo a cada dia. Muitos desses iniciam suas jornadas com pouco acesso a recursos, como materiais de divulgação e equipamentos profissionais. Apesar das dificuldades, aqueles que persistem na jornada de transmitir seus jogos podem se deparar com outro desafio: a criação de uma identidade visual que seja fiel ao seu canal e público. 

Percebendo a dificuldade que enfrentam com a criação uma identidade, decidi me dedicar a essa demanda, pois acredito que é um elemento crucial para fidelização do público e reconhecimento com anunciantes.

Desenvolvi um serviço de criação e produção de peças audiovisuais para canais de streaming de jogos. Meu objetivo era auxiliar em todas as etapas do processo, desde a definição do conceito e estilo, até a produção de vinhetas de abertura, transições, alertas e outros elementos que contribuem para a coesão visual do canal.

Overview

The gaming streamer landscape is constantly growing, with new creators emerging every day. Many of these start their journeys with limited access to resources, such as promotional materials and professional equipment. Despite the difficulties, those who persist in the journey of streaming their games may face another challenge: creating a visual identity that is true to their channel and audience.

Recognizing the difficulty they face in creating an identity, I decided to dedicate myself to this demand, as I believe it is a crucial element for audience loyalty and recognition with advertisers.

I developed a service for creating and producing audiovisual pieces for gaming streaming channels. My goal was to assist in all stages of the process, from defining the concept and style to producing intros, transitions, alerts, and other elements that contribute to the channel's visual cohesion.
O Problema

Porém, apresentar o conceito de identidade visual é algo bem técnico e distante da realidade da maioria dos streamers. Para isso, criei meu próprio canal de streaming e desenvolvi a identidade visual MECHWAR, um template completo que demonstra na prática, o potencial de uma identidade visual bem elaborada.

MECHWAR é focada em jogos com grandes robôs de combate, dividindo-se em gerenciamento de recursos e combate. A vinheta de abertura resume a experiência do jogo, enquanto as transições e alertas reforçavam cenas do que aconteciam no jogo em tempo real.

Para isso, tive que estudar tudo sobre transmissão de  jogos: sites, ferramentas, artes visuais obrigatórias e limitações técnicas. Com todas as peças necessárias em mãos, comecei minhas transmissões e apresentações comerciais para clientes, mostrando o processo de trabalho, o que seria entregue e suas as vantagens.

Com meses dedicados à pesquisa e muito esforço, essa jornada se revelou uma experiência gratificante de aprendizado e experiência. Consegui fechar negócios com novos clientes nos primeiros meses de apresentação.


The Problem

However, presenting the concept of visual identity is something quite technical and far from the reality of most streamers. To address this, I created my own streaming channel and developed the MECHWAR visual identity, a complete template that demonstrates in practice the potential of a well-developed visual identity.

MECHWAR is focused on games with large war robots, divided into resource management and combat.​​​​​​​The intro summarizes the gaming experience, while transitions and alerts reinforced scenes of what was happening in the game in real time.

To do this, I had to study everything about game streaming: websites, tools, mandatory visual arts, and technical limitations. With all the necessary pieces in hand, I started my broadcasts and commercial presentations for clients, showing the work process, what would be delivered, and its advantages.

With months dedicated to research and a lot of effort, this journey turned out to be a rewarding learning experience. I was able to close deals with new clients in the first few months of presentation.
Os Desafios

Meu objetivo era criar um vídeo realista, apresentando um mech em ação e alcançar uma narrativa coesa e uma identidade visual unificada, utilizando o mesmo robô como elemento central.

Porém, a minha experiência limitada em 3D exigiu a busca por soluções alternativas para criar o efeito desejado. Neste caso, busquei imagens renderizadas de um mesmo mech em diversas posições, compatíveis com a visão do projeto. Após uma busca em sites de stock images, encontrei um artista que havia renderizado vários ângulos de câmera de um robô que correspondia às necessidades do projeto.

The Challenges

The primary goal of this project was to establish a realistic visual identity by showcasing a mech in action. This involved achieving a cohesive narrative and unified visual, all while utilizing the same robot as the central element.

Due to limited 3D experience, alternative solutions were necessary to create the desired effect. The main challenge was finding rendered images of the same mech in different camera angles, all compatible with the project's vision. After an extensive search through stock image websites, i found an artist who had rendered multiple camera angles of a robot that perfectly aligned with the project's requirements.
Rascunho do storyboard / Storyboard sketch
1ª Style Frame
2ª Style Frame
Composição final / Final composition
Nas cenas que exibiam a interface de computador, também foi necessário criar toda a parte de UI, replicando o design do mech.

In scenes showing the computer interface, I also had to create the entire UI, replicating the mech's design.
Animatic
Obstáculos e soluções

Simular estas imagens como se fossem 3D realistas era outro desafio. Na maioria das cenas, havia uma luz de emergência que passava por cima do mech, o que, nos primeiros testes, não proporcionava a profundidade necessária de um objeto 3D.

Pesquisei várias soluções para este problema e, por curiosidade, tive uma ideia enquanto jogava o jogo DOOM (2016), em uma fase com uma luz de emergência semelhante. Para resolver isso, dupliquei a luz e adicionei um atraso na animação em comparação com a primeira luz. Esta segunda luz eu apliquei apenas em áreas distantes da câmera. Assim, consegui alcançar um resultado próximo do que eu queria.

Obstacles and solutions

Simulating these images as if they were realistic 3D was another challenge. In most scenes, there was an emergency light passing over the mech, which, in the initial tests, did not provide the necessary depth of a 3D object.

I searched for various solutions to this problem and, out of curiosity, had an idea while playing the game DOOM (2016), in a level with a similar emergency light. To address this, I duplicated the light and added a delay in the animation compared to the first light. This second light I applied only to areas distant from the camera. Thus, I was able to achieve a result close to what I wanted.

Primeiro teste com luzes /  First test with lights
Resultado final, com luzes duplicadas / Final scene, with duplicated lights
Algumas das imagens originais não possuíam iluminação suficiente para destacar os detalhes. A solução foi ajustá-las no Photoshop e recriar algumas de suas partes.

Some of the original images lacked sufficient lighting to showcase the details. The solution was to adjust them in Photoshop and recreate some of their parts.​​​​​​​
Imagem original / Original image
Imagem tratada com novo olho / Image treated with a new eye
Só a vinheta de abertura foi um grande trabalho, mas ainda era necessário desenvolver as peças intermediárias (vinhetas para intervalo, encerramento, transições, caixas de alertas). 

Para cada peça, a proposta era conectar ao que acontecia no jogo. Se era um momento de batalha, uma vinheta mostrava o mech se preparando. Após o combate no jogo, o mech voltava para reparos.

The intro was already a lot of work, but it was still necessary to develop the intermediate pieces (break scene, outro, transitions, alert boxes).

For each piece, the goal was to connect it to what was happening in the game. If it was a moment of battle, a transition showed the mech preparing itself. After the combat in the game, the mech returned for repairs.

Proposta de merchandising, integrada a identidade visual /  Merchandising proposal integrated with visual identity
Proposta de merchandising, integrada a identidade visual /  Merchandising proposal integrated with visual identity
Transição para batalha / Transition to battle
Transição para reparo / Transiton to repair
Transição / Transition
MechWar - 2.5D Cinematic
Published:

Owner

MechWar - 2.5D Cinematic

Published: